<!--
  ~ Licensed to the Apache Software Foundation (ASF) under one
  ~ or more contributor license agreements.  See the NOTICE file
  ~ distributed with this work for additional information
  ~ regarding copyright ownership.  The ASF licenses this file
  ~ to you under the Apache License, Version 2.0 (the
  ~ "License"); you may not use this file except in compliance
  ~ with the License.  You may obtain a copy of the License at
  ~
  ~ http://www.apache.org/licenses/LICENSE-2.0
  ~ Unless required by applicable law or agreed to in writing,
  ~ software distributed under the License is distributed on an
  ~ "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  ~ KIND, either express or implied.  See the License for the
  ~ specific language governing permissions and limitations
  ~ under the License.
  -->
<!--
<ng-template [ngIf]="((total$|async)>0 || displayIfEmpty)" [ngIfElse]="noContent" >
-->
<ng-container *ngIf="(paginationInfo$|async) as paginationInfo; else noContent">
    <form class="mt-3 mb-3">
        <!--
        <div class="form-row align-items-center" *ngIf="(multiplePages$|async)||displayControlsIfSinglePage">
        -->
        <div class="form-row align-items-center" *ngIf="paginationInfo.multiple()||displayControlsIfSinglePage">
            <div class="col-lg-4 col-md-2 col-sm-1">
                <label class="sr-only" for="searchQuery">{{'search.label' |translate}}</label>
                <input type="text" class="form-control" id="searchQuery" placeholder="{{'search.input'|translate}}"
                       #searchTerm
                       (keyup)="search(searchTerm.value)">
            </div>
            <div class="col-auto">
                <button type="submit" class="btn btn-primary">{{'search.button'|translate}}</button>
            </div>
        </div>


    </form>

    <ng-content></ng-content>

    <ngb-pagination *ngIf="paginationInfo.multiple()||displayControlsIfSinglePage"
                    [collectionSize]="paginationInfo.total_count" [pageSize]="pageSize" [maxSize]="pagination.maxSize"
                    [rotate]="pagination.rotate"
                    [boundaryLinks]="pagination.boundaryLinks" [ellipses]="pagination.ellipses"
                    [(page)]="page" (pageChange)="changePage($event)" aria-label="Pagination"></ngb-pagination>
</ng-container>
<ng-template #noContent>
    {{displayKeyIfEmpty|translate}}
</ng-template>